<template>
  <BasicModal v-bind="$attrs" @register="registerModal" destroyOnClose :title="title" :width="1200" @ok="handleSubmit">
    <a-card title="放行信息" :bordered="false" class="mt-5">
      <a-descriptions :column="3">
        <a-descriptions-item label="学/工号"> {{rowObj.code}} </a-descriptions-item>
        <a-descriptions-item label="姓名"> {{rowObj.name}} </a-descriptions-item>
        <a-descriptions-item label="部门"> {{rowObj.departmentId_dictText}} </a-descriptions-item>
        <a-descriptions-item label="临时通行类型"> {{rowObj.generalClassify==1?'请假':'其他'}} </a-descriptions-item>
        <a-descriptions-item label="有效开始时间"> {{rowObj.startDate}} </a-descriptions-item>
        <a-descriptions-item label="有效结束时间"> {{rowObj.endDate}} </a-descriptions-item>
      </a-descriptions>
    </a-card>
    <a-card title="请假信息" :bordered="false" class="mt-5" v-if="type==1">
      <a-descriptions :column="3">
        <a-descriptions-item label="请假事由"> {{leaveDetailObj.content}} </a-descriptions-item>
        <a-descriptions-item label="类型"> {{leaveDetailObj.afltypeText}} </a-descriptions-item>
        <a-descriptions-item label="天数"> {{leaveDetailObj.numofdate}} </a-descriptions-item>
        <a-descriptions-item label="审批人"> {{leaveDetailObj.reviewName}} </a-descriptions-item>
        <a-descriptions-item label="审核意见"> {{leaveDetailObj.reviewcontent}} </a-descriptions-item>
        <a-descriptions-item label="审批状态"> {{leaveDetailObj.status == 0?"待审核" : leaveDetailObj.status==1?"通过":"不通过"}} </a-descriptions-item>
        <a-descriptions-item label="是否出校"> {{leaveDetailObj.outschool==0?'否':'是'}} </a-descriptions-item>
       <!-- <a-descriptions-item label="班主任老师"> {{leaveDetailObj.ateacherName}} </a-descriptions-item>-->
       <!-- <a-descriptions-item label="是否销假"> {{leaveDetailObj.isResumption=='0'?'否':'是'}} </a-descriptions-item>-->
        <!--<a-descriptions-item label="销假时间"> {{leaveDetailObj.resumptionDate}} </a-descriptions-item>-->
        <!--<a-descriptions-item label="是否撤销"> {{leaveDetailObj.isCancel=='0'?'否':'是'}} </a-descriptions-item>-->
        <a-descriptions-item label="离校方式"> {{leaveDetailObj.leaveMode==1?'家长接送':'自行回家'}} </a-descriptions-item>
      </a-descriptions>
    </a-card>

    <a-card title="门信息" :bordered="false" class="mt-5">
      <a-descriptions :column="3">
        <a-descriptions-item label="门位置"> {{ch.gateName}} </a-descriptions-item>
        <a-descriptions-item label="设备"> {{ch.deviceName}} </a-descriptions-item>

      </a-descriptions>
    </a-card>
    <BasicForm @register="registerForm" v-show="false"/>




  </BasicModal>
</template>

<script lang="ts" setup>
  import {ref, computed, unref} from 'vue';
  import {BasicModal, useModalInner} from '/@/components/Modal';
  import {BasicForm, FormSchema, useForm} from '/@/components/Form/index';
  import {releaseformSchema} from '/@/views/channel/actemporarygeneral/AcTemporaryGeneral.data';
  import {saveOrUpdate,attAskforleaveQueryById,channelRelease,ssDeviceList} from '/@/views/channel/actemporarygeneral/AcTemporaryGeneral.api';
  import {list} from "@/views/channel/channel/SsChannel.api";
  // Emits声明
  const emit = defineEmits(['register','success']);
  const isUpdate = ref(true);
  const type = ref('');
  const leaveDetailObj = ref({});
  const detailObj = ref({});
  const rowObj = ref({});
  let channelOptions= ref([])
  let deviceOptions= ref([])
  //表单配置
  const releaseformSchema: FormSchema[] = [
    {
      label: '通道',
      field: 'channelId',
      component: 'Input',
      show:false,
    },
    {
      label: '通道',
      field: 'channelName',
      component: 'Input',
      dynamicDisabled:true,
    },
    {
      label: '设备',
      field: 'deviceId',
      component: 'Input',
      show:false,
    },
    {
      label: '设备',
      field: 'deviceName',
      component: 'Input',
      dynamicDisabled:true,
    },
    {
      label: 'id',
      field: 'id',
      component: 'Input',
      show:false,
    },
  ];
  const [registerForm, {setProps,resetFields, setFieldsValue, validate}] = useForm({
    //labelWidth: 150,
    schemas: releaseformSchema,
    showActionButtonGroup: false,
    baseColProps: {span: 24}
  });
  const ch = ref({});
  //表单赋值
  const [registerModal, {setModalProps, closeModal}] = useModalInner(async (data) => {
    //重置表单
    await resetFields();
    //getChannelList()
    //getDeviceList()
    setModalProps({confirmLoading: false,showCancelBtn:!!data?.showFooter,showOkBtn:!!data?.showFooter});
    console.log(data.record);
    type.value = data.record.generalClassify
    rowObj.value = data.record;
    setFieldsValue({deviceId:data.deviceId,deviceName:data.deviceName,channelName:data.channelName});
   // ch.value.channelId = data.channelId;
    ch.value.gateName = data.gateName;
    ch.value.deviceId = data.deviceId;
    ch.value.deviceName = data.deviceName;
    if(data.record.generalClassify==1){
      // 请假
      getLeaveDetail(data.record.sourceId)
    }{
      // 其他
      detailObj.value = data.record
    }
    //表单赋值
    await setFieldsValue({
      id : data.record.id
      // ...data.record,
    });

    // 隐藏底部时禁用整个表单
    setProps({ disabled: !data?.showFooter })
  });
  function channelChange(e){
    console.log(e);
    getDeviceList(e)
  }
  function getChannelList(){
    list({
    }).then(res=>{
      channelOptions.value = res.records
    })
  }
  function getDeviceList(e){
    ssDeviceList({
      channelId:e ? e : '',
      deviceType:1
    }).then(res=>{
      deviceOptions.value = res.records
    })
  }
  function getLeaveDetail(id){
    attAskforleaveQueryById({
      id,
    }).then(res=>{
      console.log(leaveDetailObj.value);
      let afltype = ['事假','病假','其他']
      res.afltypeText = afltype[res.afltype]
      leaveDetailObj.value = res
      console.log(leaveDetailObj.value);
    })
  }
  //设置标题
  const title = computed(() => ('请假放行'));
  //表单提交事件
  async function handleSubmit(v) {
    try {
      let values = await validate();
      values.id = rowObj.value.id
      setModalProps({confirmLoading: true});
      //提交表单
      await channelRelease(values);
      //关闭弹窗
      closeModal();
      //刷新列表
      emit('success');
    } finally {
      setModalProps({confirmLoading: false});
    }
  }
</script>

<style lang="less" scoped>
  /** 时间和数字输入框样式 */
  :deep(.ant-input-number){
    width: 100%
  }

  :deep(.ant-calendar-picker){
    width: 100%
  }
</style>
